<template>
  <div class="">
    <h1>这是我的文档页面</h1>
    <h2>列表清单：</h2>
    <input type="text" placeholder="请输入" :value="inputValue" @change="handleInputChange">
    <ul>
      <li :dataSource="list" >{{list}}</li>
    </ul>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  name: 'Doc',
  data () {
    return {
    }
  },
  created () {
    this.$store.dispatch('getList')

    // this.handleInputChange()
  },
  computed: {
    ...mapState(['list', 'inputValue'])
  },
  methods: {
    handleInputChange (e) {
      const a = e.target.value
      this.$store.commit('setInputValue', a)
    }
  }

}
</script>

<style scope>
.fade {
  /* width: 100px; */
  /* height: 100px; */
  background-color: antiquewhite;
}
</style>
